<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>操作元素</title>
</head>
<body>
    <div>
        <h2>第九章 闭包与作用域</h2>
        <button>收藏课程</button>
    </div>
</body>
</html>
<script>
    // new Promise(resolve => {
    //     document.querySelector("button").addEventListener("click",e=>{
    //         resolve();
    //     });
    // }).then(() => {
    //     return new Promise(resolve => {
    //         setTimeout(() => {
    //             console.log("执行收藏任务");
    //             resolve();
    //         },2000);
    //     });
    // }).then(() => {
    //     return new Promise(resolve => {
    //         setTimeout(() => {
    //             console.log('更新积分');
    //             resolve();
    //         },2000);
    //     });
    // }).then(() => {
    //     setTimeout(() => {
    //         console.log("收藏成功!奖励10积分");
    //     },2000);
    // }).catch(error => console.log(error));


    function ajax(url){
        return new Promise((resolve,reject) => {
            const xhr = new XMLHttpRequest();
            xhr.open('GET',url);
            xhr.send();
            xhr.onload = function () {
                if(this.status == 200){
                    resolve(JSON.parse(this.response));
                }else{
                    reject(this);
                }
            }
        });
    }

    //使用链式操作获取学生成绩
    ajax("http://localhost:80/basicjs/promise/php/user.php?name=向军").then(response => {
        ajax(`http://localhost/basicjs/promise/php/houdunren.php?id=${response.id}`).then(res => {
            let ul = document.createElement('ul');
            res.forEach((e,i) => {
                let li = document.createElement('li');
                let text = document.createTextNode(e.js);
                li.appendChild(text);
                ul.appendChild(li);
            });
            document.body.appendChild(ul);
        });
    });





</script>